<template>
  <el-dialog
    :title="title"
    :visible.sync="dialogVisible"
    :close-on-click-modal="false"
    width="880px"
    top="50px"
    append-to-body
  >
    <div class="form-box" v-loading="loading">
     <!-- <div class="title" v-if="noticeInfo">{{noticeInfo.noticeTitle}}</div> -->
     <div class="content ql-editor" v-if="noticeInfo" v-html="noticeInfo.noticeContent"></div>
    </div>
  </el-dialog>
</template>

<script>
import {getNotice} from "@/api/system/notice.js"
export default {
  name: "",
  data() {
    return {
      dialogVisible: false,
      loading: false,
      title: "通知公告",
      noticeInfo:null
    };
  },
  created() {
  },
  methods: {
    // 打开弹窗
    open(noticeId) {
      this.loading = true
      this.dialogVisible = true;
      this.getNotice(noticeId)
      
    },
    getNotice(noticeId){
      getNotice(noticeId).then(res=>{
        this.loading = false
        this.noticeInfo = res.data
        this.title = this.noticeInfo.noticeTitle
      })
    },
    close() {
      this.dialogVisible = false;
    },
  },
};
</script>
<style scoped lang="scss">
.form-box {
  .title{
    font-size: 18px;
    text-align: center;

  }
  ::v-deep img{
    width: 100%;
  }
}
</style>
